<template>
  <el-badge v-if="count > 0" :value="count" :max="99" class="audit-badge">
    <slot></slot>
  </el-badge>
  <slot v-else></slot>
</template>

<script setup lang="ts">
import { ref, onMounted, onBeforeUnmount } from 'vue';
import { getPendingAuditCount, getDeveloperPendingAuditCount } from '@/api/app/audit';
import { useUserStore } from '@/stores/user';

const props = defineProps<{
  type?: 'admin' | 'developer';
}>();

const userStore = useUserStore();
const count = ref(0);
let timer: number | null = null;

// 获取待审核数量
const fetchCount = async () => {
  try {
    if (props.type === 'developer' || (!props.type && !userStore.hasRole('ADMIN'))) {
      const res = await getDeveloperPendingAuditCount();
      count.value = res.data;
    } else {
      const res = await getPendingAuditCount();
      count.value = res.data;
    }
  } catch (error) {
    console.error('获取待审核数量失败', error);
  }
};

onMounted(() => {
  fetchCount();
  // 每分钟刷新一次
  timer = window.setInterval(fetchCount, 60000);
});

onBeforeUnmount(() => {
  if (timer) {
    clearInterval(timer);
    timer = null;
  }
});
</script>

<style scoped>
.audit-badge {
  margin-right: 10px;
}
</style>
